<template>
    <!-- <div>
        <p>这里是父组件</p>
        <child>
           <div>小猪课堂</div>
        </child>
    </div> -->

    <div>
        <p>这里是父组件</p>
        <child>
            <template v-slot:header>
            <div>我是 header{{ message }}</div>
            </template>
            <div>我没有名字{{ message }}</div>
            <template v-slot:footer>
            <div>我是 footer{{ message }}</div>
            </template>
        </child>
    </div>
   
</template>


<script>
import child from "./child-slot.vue"
import { ref } from "vue"
export default {
    name: 'SlotParentComponent',
    components:{child},
    data(){
        return {
            message:ref("小猪课堂")
        }
    }
}
</script>